<template>
  <div class="search">
    <div style="margin-bottom:10px">
      <el-date-picker v-model="search.time" type="daterange" align="right" style="width: 100%" value-format="yyyy-MM-dd"
        size="small" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" :picker-options="pickerOptions">
      </el-date-picker>
    </div>
    <div style="margin-bottom:10px">
      <selector ref="sensorListSelector" style="width: calc(100% - 78px)" size="small" type="sensorList" multiple placeholder="请选择对比传感器（多选）" v-model="search.list"></selector>
      <!-- @sensorItem="getSensorItem" -->
      <el-button type="primary" icon="el-icon-search" size="small" native-type="submit" @click="handleSearch">搜索</el-button>
    </div>
  </div>
</template>

<script>
  import selector from "@/views/components/selector";
  import bus from './sendMsg.js';

  export default {
    name: "search",
    components: {
      selector
    },
    props: {},
    data() {
      return {
        search: {
          list: '',
          time: [],
        },
        pickerOptions: {
          shortcuts: [{
              text: "最近一天",
              onClick(picker) {
                const start = new Date();
                const end = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24);
                picker.$emit("pick", [start, end]);
              }
            },
            {
              text: "最近三天",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 3);
                picker.$emit("pick", [start, end]);
              }
            },
            {
              text: "最近一周",
              onClick(picker) {
                const end = new Date();
                const start = new Date();
                start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                picker.$emit("pick", [start, end]);
              }
            }
            // {
            //   text: "最近一个月",
            //   onClick(picker) {
            //     const end = new Date();
            //     const start = new Date();
            //     start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
            //     picker.$emit("pick", [start, end]);
            //   }
            // }
          ]
        }
      };
    },
    computed: {},
    methods: {
      handleSearch() {
        this.$emit("search", this.search);
      },
      // getSensorItem(value) {
      //   bus.$emit('toThreeMsg', value);
      // }
    },
    created() {
		  bus.$on('send', data => {
        this.search.list = data.list;
        this.search.time = data.time;
      });
	  },
    mounted() {
      var self = this;
      //昨天的时间
      var day1 = new Date();
      day1.setTime(day1.getTime() - 24 * 60 * 60 * 1000);
      var start = day1.getFullYear() + "-" + (day1.getMonth() + 1) + "-" + day1.getDate();
      //今天的时间
      var day2 = new Date();
      day2.setTime(day2.getTime());
      var end = day2.getFullYear() + "-" + (day2.getMonth() + 1) + "-" + day2.getDate();
      let time = [start, end];
      self.search.time  = time;
      var sesorList = this.$refs.sensorListSelector;
      setTimeout(function () {
        self.search.list = [sesorList.options[0].value];
        self.handleSearch();
      }, 10000);
    }
  };
</script>
<style lang="scss" scoped>
  .search {
    position: relative;
    background-color: #fff;
    padding: 16px;
  }
</style>
